<template>
  <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
  >
    <div class="body">
      <div
        class="box"
        v-for="(item, index) in shoppingList"
        :key="index"
        @click="show(item)"
      >
        <router-link to="/shoppingdetail">
          <img :src="item.imgUrl" alt="" />
          <p class="p1">{{ item.masterName }}</p>
          <p class="p2">{{ item.slaveName }}</p>
          <div class="da1">
            <p style="font-size: 15px; color: #d92c01">
              <span>￥</span>
              <span>{{ item.minPrice / 100 }}</span>
            </p>
            <p style="font-size: 12px; color: #999">
              <span>销量:</span>
              <span style="font-size: 14px">{{ item.inventory }}</span>
            </p>
          </div>
        </router-link>
      </div>
    </div>
  </van-list>
</template>

<script>
import $axios from "@/api/request";
export default {
  data() {
    return {
      loading: false,
      finished: false,
      shoppingList: [],
    };
  },
  methods: {
    show(item) {
      this.$router.push({
        path: `/shoppingdetail/${item.productId}`,
      });
    },

    onLoad() {
      let obj = {
        currPage: this.currPage,
      };
      $axios.get("http://zl.huruqing.cn:3003/product/list",obj).then((res) => {
        this.currPage++;
        this.shoppingList =[
          ...this.shoppingList,
          ...res.list
        ];
        this.loading=false
      });
    },
  },
};
</script>

<style>
</style>